rh._.exports({"0":[[" ","JavaScript"]],"1":[[" ","NOTE",": This page is currently a ","Work In Progress","."," ","One of the methods available to developers for creating instruments is to use a combination of HTML, JavaScript and CSS, as well as some ","optional"," XML. Together these files are placed in a location within a project (either as part of an aircraft, or as a unique package that can be used by multiple aircraft), and essentially they work together as follows:"," ","The HTML provides the \"framework\" for the gauge"," ","The JavaScript provides the logic"," ","The CSS provides the styling"," ","The XML (","panel.xml",") provides additional functionality and is referenced from the JavaScript"," ","The \"glue\" that holds all this together is ","Coherent GT",", which is the web engine being used by ","Microsoft Flight Simulator"," to display glasscockpits. This allows the simulation to bind its C++ data to the JavaScript used to make the gauges and instruments. Using Coherent means that you can call functions on the C++ side while also listening to events on the JavaScript side. Using Coherent also has the additional benefit that it enables you to move large amounts of data - like setting flightplans, or getting the nearest airports, etc... - which is something that just can't be done using SimVars. Also note that Coherent has a web interface that permits you to debug your instruments, which is explained on the following page:"," ","Coherent GT Debugger"," ","Also note that you can find tutorials for creating HTML/JS/CSS instruments on the following page:"," ","Instruments"," ","Finally, it is worth noting that these sections describe the underlying SDK API for creating gauges using JavaScript, however many aircraft - both custom ones and those from Microsoft - use the ","MSFS Avionics Framework",", which is a component based API specifically designed for making instrumentation using a React-like framework. You can find more information here:"," ","MSFS Avionics Framework"," ","Note that this framework is not covered by the standard SDK documentation as it is already extensively documented at the link above."],[" ","The most basic setup for your HTML file will look something like this:"," ","\n\n"," ","This links the CSS stylesheet to use, calls the relevant scripts, and also calls the JavaScript file you have created for the gauge. Now, there are some things to note here:"," ","Your HTML will be inserted in the DOM so there is no need to create a regular HTML boilerplate with the usual ","",", ","",", and ",""," sections."," ","You can reference your CSS file as you would normally using a ",""," tag."," ","Your gauge HTML needs to be inside of a ","\n "," ","We won't go into exactly what's going on here as the basis for the HTML is explained further up this page (","HTML Setup","), although it's worth emphasising that the ","very last thing in the file"," should be the ","